<template>
  <div>
    <el-form :model="listQuery" label-width="70px" class="zxForm">
    	<el-col :span="8">
    		<el-form-item label="标题" prop="title">
    			<el-input v-model.trim="listQuery.title" placeholder="请输入" @keyup.enter.native="getList"></el-input>
    		</el-form-item>
    	</el-col>
    	<el-col :span="8">
    		<el-form-item label="中心词" prop="keyword">
    			<el-input v-model.trim="listQuery.keyword" placeholder="请输入" @keyup.enter.native="getList"></el-input>
    		</el-form-item>
    	</el-col>
    	<el-col :span="8">
    		<el-form-item label="个股" prop="secname">
    			<el-input v-model.trim="listQuery.secname" placeholder="请输入" @keyup.enter.native="getList"></el-input>
    		</el-form-item>
    	</el-col>
    	<el-col :span="8">
    		<el-form-item label="行业" prop="industry">
    			<el-input v-model.trim="listQuery.industry" placeholder="请输入" @keyup.enter.native="getList"></el-input>
    		</el-form-item>
    	</el-col>
    	<el-col :span="8">
    		<el-form-item label="概念" prop="concept">
    			<el-input v-model.trim="listQuery.concept" placeholder="请输入" @keyup.enter.native="getList"></el-input>
    		</el-form-item>
    	</el-col>
    	<el-col :span="8">
    		<el-button style="margin-left: 70px;" type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
    	</el-col>
    </el-form>
    <el-table :data="tableData" v-loading="listLoading" element-loading-text="加载中..." border fit highlight-current-row max-height="500" @selection-change="evtSelect">
      <el-table-column align="center" type="selection" width="55"></el-table-column>
    	<el-table-column  label="资讯标题" align="center" show-overflow-tooltip>
			<template slot-scope="scope">
				<div class="titleStyle">{{ scope.row.title }}</div>
			</template>
		</el-table-column>
    	<el-table-column prop="news_id" label="资讯id" align="center" show-overflow-tooltip></el-table-column>
    	<el-table-column prop="source" label="来源" align="center" width="95" show-overflow-tooltip></el-table-column>
      <el-table-column prop="update_time" label="更新时间" align="center" width="160"></el-table-column>
    </el-table>
    <div class="pagination-container">
    	<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="listQuery.pageNum"
    	 :page-sizes="[10,20,30,50]" :page-size="listQuery.pageSize" layout="total, sizes, prev, pager, next, jumper"
    	 :total="total"></el-pagination>
    </div>
    <div style="text-align: center;margin-top: 15px;">
    	<el-button @click="goBack">取消</el-button>
    	<el-button type="primary" @click="saveNews">确定</el-button>
    </div>
  </div>
</template>

<script>
  import { listNewsInfo } from '../../api/article'

  export default {
  	name: 'searchNews',
  	data() {
  		return {
  			listQuery: {
  				pageNum: 1,
  				pageSize: 20,
  				title: '',
  				keyword: '',
  				secname: '',
  				industry: '',
  				concept: ''
  			},
        total: 0,
        listLoading:false,
  			tableData:[],
        evtSelection:[]
  		}
  	},
  	created() {
      this.getList()
  	},
  	methods: {
      getList() {
      	this.listLoading = true
      	listNewsInfo(this.listQuery).then(res => {
      		this.listLoading = false
      		this.tableData = res.Data
      		this.total = parseInt(res.PageInfo.Total)
      	}).catch(err=>{
			  this.listLoading = false;
		  })
      },
      evtSelect(val) {
        this.evtSelection = val
      },
      handleSizeChange(val) {
      	this.listQuery.pageSize = val
      	this.getList()
      },
      handleCurrentChange(val) {
      	this.listQuery.pageNum = val
      	this.getList()
      },
  		goBack() {
  			this.$emit('closeDio')
  		},
      saveNews() {
        if(!this.evtSelection.length) return this.$message({ type: 'warning', message: '请勾选资讯' })
        this.$emit('getMethod', this.evtSelection)
      }
  	}
  }
</script>

<style lang="stylus" scoped>
  .zxForm {
  	margin-top: -10px;
  	/deep/ .el-form-item {
  		margin-bottom: 10px!important;
  	}
  }
  .titleStyle{
	  overflow:visible;
	  width:100%;
	  white-space:normal;
	  line-height:150%;
  }
</style>
